<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>将军的列表 表单 新元素实验</title>
	</head>
	<body>
		<p align="center">
		<a name="fix"><h1></h1></a>
		<h1><p align="center">列表</p></h1>
		<!--1.无序列表 ul li
		2.有序列表 ol li
		3.定义列表 dl dt dd-->
		<ul>
			<li>魁拔1</li>
			<li>魁拔2</li>
			<li>魁拔3</li>
		</ul>
		<ol>
			<li>我推的孩子</li>
			<li>我推的孩子第二季</li>
			<li>我推的孩子第三季</li>
		</ol>
		<dl>
			<dt><img src="No.1/img/条纹粉色jpg.jpg" alt="粉色背景" width="360px"height="360px" /></dt>
			<dd>粉色背景板</dd>
		</dl>
		<h1><p align="center">表单</p></h1>
		<!--采集用户信息 账户登录 颜色 功能性操作
		<button>提交</button> 假提交-->
		<form>
		<br />账号:<input type="text" />
		<br />密码:<input type="password" />
		&nbsp
		<br /><input type="submit" />
		&nbsp
		<br /><input type="reset" />
		</form>
		<form>
		<h2>你的性别</h2>
		<br />男 <input type="radio" name="sex"/>
		<br />女 <input type="radio" name="sex"/>
		<h2>你的喜好</h2>
		<br />荤 <input type="radio" name="checkbox"/>
		<br />素 <input type="radio" name="checkbox"/>
		<br /><input type="reset" />
		</form>
		<h1><p align="center">新元素</p></h1>
		<!--标记（荧光笔） mark
		 电量槽 meter
		 存贮三角
		 <details>
			<summary></summary>
			<div></div>
		</details>-->
		<br /><mark>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Vero eos corporis doloremque soluta esse voluptatem. Hic numquam officiis, sapiente, cupiditate, nulla architecto debitis sint excepturi ut tenetur voluptates doloremque ea.</mark>
		<br /><meter value="700" max="1000"min="0"></meter>
		<details>
			<summary>默认显示效果</summary>
			<div>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Molestiae voluptatum nostrum fugit doloremque dignissimos velit perspiciatis. Odio, qui accusantium? Nemo saepe error ipsa nam consequatur quam doloremque iusto laboriosam cum? Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus, dolores veniam voluptatem similique vero ab dolore et illum vitae obcaecati, magnam quae tempora sed consequuntur facere nam maxime numquam quibusdam! Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quas, totam vero magni sunt ratione quisquam culpa explicabo voluptatem eum rem molestias voluptatum error voluptatibus iure laborum dolore, repellat quos recusandae?</div>
		</details>
		</p>
		<a href="#fix"><p align="center">返回顶部</p></a>
	</body>
</html>